import "normalize.css";
import "./assets/main.scss";

// 引入element plus的样式
import "element-plus/dist/index.css";

// 引入图标
import * as ElementPlusIconsVue from "@element-plus/icons-vue";

import piniaPluginPersistedstate from "pinia-plugin-persistedstate";

import { createApp } from "vue";
import { createPinia } from "pinia";

import App from "./App.vue";
import router from "./router";
import { useUserStore } from "./stores/user";

const app = createApp(App);

app.directive("auth", {
  mounted(el, binding) {
    console.log(el); //指令所在的元素 dom
    console.log(binding.value); //给指令绑定的值--> 记录 谁有操作权限  ['admin:list:delete', 'common:list:delete']
    // 拿到服务返回的用户的按钮权限信息
    let userStore = useUserStore();
    // debugger;
    console.log(userStore.auths);

    // 判断  auths 中 是否一个元素 在 binding.value
    let flag = false;
    userStore.auths.forEach((v) => {
      debugger;

      //  v 是否在 binding.value中
      if (binding.value.includes(v)) {
        flag = true;
      }
    });
    if (flag == false) {
      // el.style.display='none'
      el.remove();
    }

    //
  }
});

// 注册所有图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}

let pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
app.use(pinia);
app.use(router);

app.mount("#app");
